<template>
    <div class="app-container">
        <!-- 添加或修改股票日志对话框 -->
        <el-form ref="logRef" :model="form" :rules="rules" label-width="80px">
            <el-row :gutter="10">
                <el-col :span="4">
                    <el-form-item label="上证指数" prop="yuBuy">
                        <el-autocomplete v-model="form.yuBuy" :fetch-suggestions="querySearchGuPiaoList"
                            placeholder="请输入 guName" @select="handleSelect" clearable value-key="guName"
                            @clear="handleClear"></el-autocomplete>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item label="量" prop="yuBuyPrice">
                        <el-input v-model="form.yuBuyPrice" placeholder="请输入">
                            <template #append>亿</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item label="额" prop="yuNum">
                        <el-input v-model="form.yuNum" placeholder="数量">
                            <template #append>亿</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item label="开" prop="yuCellPrice">
                        <el-input v-model="form.yuCellPrice" placeholder="请输入">
                          
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item label="高" prop="yuCellNum">
                        <el-input v-model="form.yuCellNum" placeholder="数量">
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item label="低" prop="yuCellNum">
                        <el-input v-model="form.yuCellNum" placeholder="数量">
                        </el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="13">
                    <el-form-item label="日志内容">
                        <editor v-model="form.logData" :min-height="892" :width="1000" />
                    </el-form-item>
                </el-col>
               <el-col :span="9">
                    <el-row>
                        <el-col :span="1" :offset="2">
                            <el-form-item>
                                <el-button type="primary" icon="Search" @click="submitForm">确 定</el-button>
                            </el-form-item>
                        </el-col>
                        <el-col :span="1" :offset="3">
                            <el-form-item>
                                <el-button type="primary" icon="Search" @click="getGeGu">获取各股当天数据</el-button>
                            </el-form-item>
                        </el-col>
                        <el-col :span="1" :offset="6">
                            <el-form-item>
                                <el-button type="primary" icon="Search" @click="getGeBanKuai">获取各板块当天数据</el-button>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script setup name="Log">
import { listLog, getLog, delLog, addLog, updateLog } from "@/api/web/log";
import { ref } from "vue";
import { listGupiao, listGupiaoAll } from "@/api/web/gupiao";
import { getTengxun } from "@/api/web/day";
import { getTengxunData } from "@/api/web/stock"
const { proxy } = getCurrentInstance();

const logList = ref([]);
const open = ref(false);
const loading = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const stuHobbyContent = ref("");
const logTitle = ref("");
const logDate = ref("");

const data = reactive({
    form: {},
    queryParams: {
        pageNum: 1,
        pageSize: 10,
        logData: null,
    },
    rules: {},
});
// 从API获取股票数据
const querySearchGuPiaoList = async (queryString, cb) => {
    try {
        const response = await listGupiaoAll();
        cb(response.rows);
    } catch (error) {
        console.error("搜索失败:", error);
        cb([]);
    }
};
const { queryParams, form, rules } = toRefs(data);

/** 查询股票日志列表 */
function getList() {
    loading.value = true;
    listLog(queryParams.value).then((response) => {
        logList.value = response.rows;
        total.value = response.total;
        loading.value = false;
    });
}

function getGeGu() {
    getTengxun();
}
function getGeBanKuai() {
    getTengxunData();
}

// 取消按钮
function cancel() {
    open.value = false;
    reset();
}

// 表单重置
function reset() {
    form.value = {
        pageNum: 1,
        pageSize: 10,
        logData: null,
        yuBuy: null,
        yuNum: null,
        yuCell: null,
        bankuai: null,
        yuBuyPrice: null,
        yuCellNum: null,
        yuCellPrice: null,
    };
    proxy.resetForm("logRef");
}

function handleView(item) {
    //openView.value = true;
    stuHobbyContent.value = item.logData;
    logTitle.value = item.remark;
    logDate.value = item.createTime;
}

/** 搜索按钮操作 */
function handleQuery() {
    queryParams.value.pageNum = 1;
    getList();
}

/** 重置按钮操作 */
function resetQuery() {
    proxy.resetForm("queryRef");
    handleQuery();
}

// 多选框选中数据
function handleSelectionChange(selection) {
    ids.value = selection.map((item) => item.id);
    single.value = selection.length != 1;
    multiple.value = !selection.length;
}

/** 新增按钮操作 */
function handleAdd() {
    reset();
    open.value = true;
    title.value = "添加股票日志";
}

/** 修改按钮操作 */
function handleUpdate(row) {
    reset();
    const _id = row.id || ids.value;
    getLog(_id).then((response) => {
        form.value = response.data;
        open.value = true;
        title.value = "修改股票日志";
    });
}

/** 提交按钮 */
function submitForm() {
    proxy.$refs["logRef"].validate((valid) => {
        if (valid) {
            if (form.value.id != null) {
                updateLog(form.value).then((response) => {
                    proxy.$modal.msgSuccess("修改成功");
                    open.value = false;
                    getList();
                });
            } else {
                addLog(form.value).then((response) => {
                    proxy.$modal.msgSuccess("新增成功");
                    open.value = false;
                    getList();
                });
            }
        }
    });
}

/** 删除按钮操作 */
function handleDelete(row) {
    const _ids = row.id || ids.value;
    proxy.$modal
        .confirm('是否确认删除股票日志编号为"' + _ids + '"的数据项？')
        .then(function () {
            return delLog(_ids);
        })
        .then(() => {
            getList();
            proxy.$modal.msgSuccess("删除成功");
        })
        .catch(() => { });
}

/** 导出按钮操作 */
function handleExport() {
    proxy.download(
        "web/log/export",
        {
            ...queryParams.value,
        },
        `log_${new Date().getTime()}.xlsx`
    );
}

getList();
</script>
